<template>
  <div>
    <search-form
      :search-config="searchConfig"
      :label-width="150"
      @clear="clearSearch"
      @search="handleSearch"
      @visible-change="handleVisibleChange"
    />
    <table-box ref="tableBox" show-index show-selection :other-filters="filtersRaw" :other-raw="paramsRaw" :table-config="tableConfig" @selection-change="handleSelectionChange" @btnOperate="handleBtnOperate" />
    <export-files
      v-if="exportisible"
      title="导出"
      :visible.sync="exportisible"
      download-url=""
      download-prefix=""
      :config="exportConfig"
      :success-fun="(config,res)=>{}"
      @success="handleExportSuccess"
    />
  </div>
</template>

<script>
import { getToken } from '@/utils/auth'
export default {
  name: 'PotentialCustomerMarketChange',
  components: { },
  props: {
  },
  data() {
    return {
      searchConfig: [
        { label: '意向客户电话', prop: 'intendenCustomerPhone', type: 'text', value: '', placeholder: '' },
        { label: '意向客户姓名', prop: 'intendenCustomerName', type: 'text', value: '', placeholder: '' },
        { label: '变更前市场编码', prop: 'changeBeforeMarketCode', type: 'text', value: '', placeholder: '' },
        { label: '变更前市场名称', prop: 'changeBeforeMarketName', type: 'text', value: '', placeholder: '' },
        { label: '变更后市场编码', prop: 'changeAfterMarketCode', type: 'text', value: '', placeholder: '' },
        { label: '变更后市场名称', prop: 'changeAfterMarketName', type: 'text', value: '', placeholder: '' },
        {
          type: 'select',
          prop: 'changeType',
          label: '变更类型',
          value: '',
          placeholder: '',
          config: {
            remote: true,
            // paramField: 'keyWord',// 远程搜索参数名
            remoteUrl: `/data-dict/api/v2/dictionary/CTM_TOBE_CUS_MARKET_CHANGE_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'slm', domainCode: 'marketing' },
            apiHeader: {
              // 'Permission-Code': 'per_pur_order_middle_page',
              // 'Permission-App': 'slm'
            }
          }
        }
      ],
      tableConfig: {
        interfacePath: `${process.env.VUE_APP_BASE_API}/api/v1/ctmFranchiseMarketChange/page`,
        hideSearchBar: true,
        sort: 'createTime',
        order: 'DESC',
        setting: [
          {
            prop: 'intendenCustomerPhone',
            label: '意向客户电话',
            minWidth: 130
          },
          {
            prop: 'intendenCustomerName',
            label: '意向客户姓名',
            minWidth: 130
          },
          {
            prop: 'changeBeforeMarketCode',
            label: '变更前市场编码',
            minWidth: 130
          },
          {
            prop: 'changeBeforeMarketName',
            label: '变更前市场名称',
            minWidth: 130
          },
          {
            prop: 'changeAfterMarketCode',
            label: '变更后市场编码',
            minWidth: 130
          },
          {
            prop: 'changeAfterMarketName',
            label: '变更后市场名称',
            minWidth: 130
          },
          {
            prop: 'changeName',
            label: '变更人',
            minWidth: 120
          },
          {
            prop: 'changeTime',
            label: '变更时间',
            minWidth: 140
          },
          {
            prop: 'changeType',
            label: '变更类型',
            minWidth: 120,
            propEnum: {
              appCode: 'slm',
              domainCode: 'marketing',
              dictTypeCode: 'CTM_TOBE_CUS_MARKET_CHANGE_TYPE'
            }
          }
        ],
        btnList: process.env.NODE_ENV === 'development' ? [
          { buttonName: '导出', optCode: 'export', outerFlag: true }
        ] : null
      },
      exportisible: false,
      selectedRows: [],
      filtersRaw: [],
      paramsRaw: {}
    }
  },
  computed: {
    exportConfig() {
      return [
        {
          code: '1',
          name: '意向客户特许经营市场变更',
          async: false, // 同步导出数据
          templateCode: '', // 模板code
          dataApi: `${process.env.VUE_APP_BASE_API}/api/v1/ctmFranchiseMarketChange/export`, // 数据导出api
          headers: { token: getToken() },
          filtersRaw: this.filtersRaw, // 符合当前查询条件的所有数据行的导出条件(当前数据查询结果对应的条件)
          paramsRaw: this.paramsRaw,
          sort: 'createTime', // 排序字段
          order: 'desc', // 排序方式
          selectedRows: this.selectedRows, // 当前所选中的数据行
          queryField: 'id'// 指定行导出时使用的查询字段名称
        }
      ]
    }
  },
  methods: {
    clearSearch() {

    },
    handleSearch({ filtersRaw, paramsRaw }) {
      this.filtersRaw = filtersRaw
      this.paramsRaw = paramsRaw
      this.refreshTableBoxData()
    },
    handleVisibleChange() {
      this.$nextTick(() => {
        this.$refs.tableBox && this.$refs.tableBox.refreshTableHeight()
      })
    },
    refreshTableBoxData(flag) {
      this.$nextTick(() => {
        this.$refs.tableBox.initTableData(flag)
      })
    },
    handleSelectionChange(rows) {
      this.selectedRows = rows
    },
    handleBtnOperate(flag) {
      this[flag] && this[flag]()
    },
    export() {
      this.exportisible = true
    },
    handleExportSuccess() {

    }
  }
}
</script>
